<%@ page language="java" pageEncoding="utf-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath =
            request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";

%>
<!DOCTYPE HTML>
<html>
<head>
    <base href="<%=basePath %>">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <title>添加文章</title>
    <!-- 日历控件js -->
    <script type="text/javascript"
            src="static/util/plugins/calendarcontrol/lhgcore.js"></script>
    <script type="text/javascript"
            src="static/util/plugins/calendarcontrol/lhgcalendar.js"></script>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet"
          href="static/admin/css/bootstrap/css/bootstrap-3-3-5.min.css">
    <link rel="stylesheet" type="text/css"
          href="static/util/plugins/uploadify/uploadify.css"/>
    <link rel="stylesheet" type="text/css"
          href="static/util/css/jquery.alerts.css" media="screen"/>
    <link rel="stylesheet" type="text/css"
          href="static/util/css/jquery.tagsinput.css"/>

    <script type="text/javascript" src="static/js/jquery1-11-3.min.js"></script>
    <script type="text/javascript"
            src="static/util/plugins/uploadify/jquery.uploadify.js"></script>
    <script type="text/javascript" src="static/util/js/jquery.alerts.js"></script>
    <script type="text/javascript" src="static/util/js/jquery.tagsinput.min.js"></script>
    <script type="text/javascript"
            src="static/util/js/jquery.ui.draggable.js"></script>
    <script type="text/javascript">

        $(function () {
            $("#keyWord").tagsInput({width: 'auto', height: '40px'});//关键字标签输入域的加载
            $("#keyWord_tagsinput").css({'padding': '0px', 'height': '35px'});  //设置样式
            //end

            //文件的上传
            $("#upload_org_code").uploadify({
                'height': 27,
                'width': 80,
                'buttonText': '选择图片',
                'swf': 'static/util/plugins/uploadify/uploadify.swf',
                'uploader': 'Upload?paramName=artclecover',
                'auto': true, //自动上传
                'checkExisting': false, //不检查重复文件
                'multi': false,  //允许多文件
                'fileTypeExts': '*.jpg;*.jpeg;*.gif;*.png;*.bmp',
                'fileSizeLimit': '0.2MB',
                fileDesc: '请选择图像文件',
                rollover: true,
                removeCompleted: false, //上传成功，去掉进度条
                wmode: 'transparent',//设置该项为transparent 可以使浏览按钮的flash背景文件透明，并且flash文件会被置为页面的最高层。 默认值：opaque 。
                'onUploadSuccess': function (file, data, response) {   //上传成功所做的动作
                    $('#' + file.id).find('.data').html('');
                    var fileName = "";
                    var upFileName = "";
                    var fileSize = "";
                    var fileExt = "";
                    var jsonObj = JSON.parse(data);  //解析后台返回的数据
                    for (var o in jsonObj) {
                        fileName = jsonObj[o].fileName;
                        fileSize = jsonObj[o].size;
                        upFileName = jsonObj[o].upFileName;
                        fileExt = jsonObj[o].extName;
                    }
                    $("#articleImage").val(upFileName);
                    $("#articleUpName").val(fileName);
                    $("#articleUpSize").val(fileSize);
                    $("#upload_org_code").hide(); //上传按钮的隐藏了，只允许上传一个文件
                    $(".cancel > a").attr("href", "javascript:deleteImage('" + upFileName + "')");  //删除图标变成了删除文件而不是上传之前的停止
                },
                //加上此句会重写onSelectError方法【需要重写的事件】
                'overrideEvents': ['onSelectError', 'onDialogClose'],
                //返回一个错误，选择文件的时候触发
                'onSelectError': function (file, errorCode, errorMsg) {
                    switch (errorCode) {
                        case -110:
                            jAlert("文件 [" + file.name + "] 大小超出系统限制的" + jQuery('#upload_org_code').uploadify('settings', 'fileSizeLimit') + "大小！", '提示');
                            break;
                        case -120:
                            jAlert("文件 [" + file.name + "] 大小异常！", '提示');
                            break;
                        case -130:
                            jAlert("文件 [" + file.name + "] 类型不正确！", '提示');
                            break;
                    }
                }
            });
            var image = $("#articleImage").val();
            var upname = $("#articleUpName").val();
            var upsize = $("#articleUpSize").val();
            if (image) {
                $("#upload_org_code").hide();

                $("#upload_org_code-queue").append("<div id=\"SWFUpload_0_0\" class=\"uploadify-queue-item\"><div class=\"cancel\"><a href=\"javascript:deleteImage('" + image + "')\">X</a></div><span class=\"fileName\">" + upname + " (" + upsize / 1000 + "KB)</span><span class=\"data\"></span><div class=\"uploadify-progress\"><div class=\"uploadify-progress-bar\" style=\"width: 100%;\"><!--Progress Bar--></div></div></div>");
            }
        });
        //文件的删除
        function deleteImage(fileName) {
            $.ajax({
                type: "get",
                url: "admin/attach/delete",
                data: {
                    "fileName": fileName,
                    "paramName": 'artclecover',
                    "isAsynchr": 'false'
                },
                success: function (result) {
                    if (result.success) {
                        OutMessageBox("删除成功!", "ok", "3000");
                        $("#articleImage").val('');
                        $("#articleUpName").val('');
                        $("#articleUpSize").val('');
                        $(".uploadify-queue-item").remove();
                        $("#upload_org_code").show();
                    } else if (result.errNo == -1) {
                        OutMessageBox("文件不存在!", "ok", "3000");
                        $("#articleImage").val('');
                        $("#articleUpName").val('');
                        $("#articleUpSize").val('');
                        $(".uploadify-queue-item").remove();
                        $("#upload_org_code").show();
                    } else {
                        OutMessageBox("删除失败!", "no", "3000");
                    }
                }
            });
        }
        //弹出提示框
        function OutMessageBox(content, ico, time) {
            $.msgbox.show({
                message: content,
                icon: ico,
                timeOut: time,
                beforeHide: function () {
                    //自定义的执行后方法
                }
            });
        }
    </script>

</head>

<body>
<!-- 配置文件 -->
<script type="text/javascript"
        src="static/util/plugins/ueditor1.4/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript"
        src="static/util/plugins/ueditor1.4/ueditor.all.min.js"></script>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-10">
            <div class="panel panel-success" style="margin-top:30px;">
                <div class="panel-heading">编辑文章信息</div>
                <div class="panel-body">
                    <form class="form-horizontal" action="admin/website/article/saveArticle"
                          method="post" onsubmit=" return formsubmit()">
                        <%
                            String reqcaid = String.valueOf(request.getAttribute("caid"));
                            if (reqcaid == null || reqcaid.trim().equals("")
                                    || reqcaid.trim().equalsIgnoreCase("NULL")) {
                                reqcaid = request.getParameter("caid");
                            }
                        %>
                        <div class="form-group">
                            <input type="hidden" id="caid" name="articleInfo.caId"
                                   value="<%=reqcaid%>"/>
                            <input type="hidden" name="articleInfo.id" value="${articleInfo.id}"/>
                            <input type="hidden" id="contentId" name="articleInfo.content" value=""/>
                            <input type="hidden" id="contentText" name="articleInfo.contentText"
                                   value="${articleInfo.contentText}"/>
                            <input type="hidden" id="articleImage" name="articleInfo.coverImage"
                                   value="${articleInfo.coverImage}"/>
                            <input type="hidden" id="articleUpName" name="articleInfo.coverUpName"
                                   value="${articleInfo.coverUpName}"/>
                            <input type="hidden" id="articleUpSize" name="articleInfo.coverUpSize"
                                   value="${articleInfo.coverUpSize}"/>
                            <input type="hidden" name="articleInfo.indexId" value="${articleInfo.indexId}"/>
                            <input type="hidden" name="articleInfo.articleClick}" value="${articleInfo.articleClick}"/>
                            <input type="hidden" name="articleInfo.orderId" value="${articleInfo.orderId}"/>
                            <input type="hidden" name="articleInfo.state" value="P"/>
                        </div>
                        <div class="form-group" style="height:40px;">
                            <label class="col-sm-2 control-label">文章标题</label>
                            <div class="col-sm-10">
                                <input class="form-control" id="title" placeholder="请填写标题"
                                       required="required"
                                       name="articleInfo.title"
                                       value="${articleInfo.title}"
                                />
                            </div>
                        </div>
                        <div class="form-group" style="height:40px;margin-top:20px;">
                            <label class="col-sm-2 control-label">时间</label>
                            <div class="col-sm-4">
                                <input class="form-control" placeholder="点击选择日期"
                                       id="dateTime" readOnly="readOnly"
                                       onclick="J.calendar.get({time:true})"
                                       name="articleInfo.dateTime"
                                       value="${articleInfo.dateTime}"
                                />

                            </div>
                            <label class="col-sm-2 control-label" style="text-align: right;">文章作者</label>
                            <div class="col-sm-4">
                                <input class="form-control" id="author"
                                       placeholder="采编作者" required="required"
                                       name="articleInfo.author"
                                       value="${articleInfo.author}"
                                />
                            </div>
                        </div>

                        <div class="form-group" style="height:40px;margin-top:20px;">
                            <label class="col-sm-2 control-label">关键字</label>
                            <div class="col-sm-4">
                                <input class="form-control input-tags" id="keyWord"
                                       placeholder="请输入关键字按回车确认"
                                       name="articleInfo.keyWord"
                                       value="${articleInfo.keyWord}"
                                />
                            </div>
                            <label class="col-sm-2 control-label" style="text-align: right;">来源</label>
                            <div class="col-sm-4">
                                <input class="form-control" id="source"
                                       placeholder="来源"
                                       name="articleInfo.source"
                                       value="${articleInfo.source}"
                                />
                            </div>
                        </div>
                        <div class="form-group" style="height:50px;margin-top:20px;">
                            <label class="col-sm-2 control-label">封面图</label>
                            <div class="col-sm-4">
                                <button name="upload_org_code" id="upload_org_code"></button>
                            </div>
                            <label class="col-sm-2 control-label" style="text-align: right;">类型</label>
                            <div class="col-sm-4">
                                <select class="form-control" name="articleInfo.type">
                                    <option
                                            <c:if test="${articleInfo.type eq 'T' || articleInfo.type eq ''}">
                                                selected
                                            </c:if> value="T">
                                        文本
                                    </option>
                                    <option
                                            <c:if test="${articleInfo.type eq 'P'}">selected</c:if> value="P">
                                        图片
                                    </option>
                                    <option
                                            <c:if test="${articleInfo.type eq 'V'}">selected</c:if> value="V">
                                        视屏
                                    </option>
                                    <option
                                            <c:if test="${articleInfo.type eq 'F'}">selected</c:if> value="F">
                                        FLASH
                                    </option>
                                    <option
                                            <c:if test="${articleInfo.type eq 'L'}">selected</c:if> value="L">
                                        巨幕
                                    </option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group" style="height:40px;margin-top:20px;">
                            <label class="col-sm-2 control-label">是否HOT</label>

                            <div class="col-sm-4" style="text-align:center;">
                                <label class="form-control">
                                    <input type="radio" name="articleInfo.isHotPaper"
                                            <c:if test="${articleInfo.isHotPaper eq 'N' ||
												articleInfo.isHotPaper eq '' || articleInfo.isHotPaper eq null}">
                                                checked="true"
                                            </c:if>
                                           value="N"/>否
                                    <input type="radio"
                                            <c:if test="${articleInfo.isHotPaper eq 'Y'}"> checked="true" </c:if>
                                           name="articleInfo.isHotPaper" value="Y"/>是
                                </label>
                            </div>
                            <label class="col-sm-2 control-label" style="text-align: right;">评论</label>
                            <div class="col-sm-4" style="text-align:center;">
                                <label class="form-control">
                                    <input type="radio" name="articleInfo.openComment"
                                            <c:if test="${articleInfo.openComment eq 'Y' ||
												articleInfo.openComment eq '' || articleInfo.openComment eq null}">
                                                checked="true"
                                            </c:if>
                                           value="Y"/>开
                                    <input type="radio" name="articleInfo.openComment"
                                            <c:if test="${articleInfo.openComment eq 'N'}"> checked="checked"
                                            </c:if>
                                           value="N"/>关
                                </label>
                            </div>
                        </div>
                        <div class="form-group" style="height:40px;">
                            <label class="col-sm-2 control-label">文章说明</label>
                            <div class="col-sm-10">
									<textarea class="form-control" rows="" cols="" style="max-width: 100%"
                                              name="articleInfo.remark"></textarea>
                            </div>
                        </div>
                        <div class="form-group" style="height:20px;">
                            <label class="col-sm-2 control-label">&nbsp;</label>
                            <div class="col-sm-10">&nbsp;</div>
                        </div>
                        <div class="form-group" style="height:20px;">
                            <div class="col-sm-12">
                                <div id="editordiv">
                                    <!-- 初始化编辑器的文本 -->
                                    <script id="container" name="content" type="text/plain">
       										${articleInfo.content}

                                    </script>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label"></label>
                            <div class="col-sm-10" style="height:80px">
									<span style="color:red;font-size:12px;">
                                        ${actionError}
                                    </span>
                            </div>
                        </div>
                        <div class="form-group" style="text-align:center;">
                            <c:choose>
                                <c:when test="${actionType eq 'update'}">
                                    <button type="submit" class="btn btn-info btn-sm">修改</button>
                                </c:when>
                                <c:otherwise>
                                    <button type="submit" class="btn btn-success btn-sm">保存</button>
                                </c:otherwise>
                            </c:choose>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <button type="button" class="btn btn-warning btn-sm"
                                    onclick="window.history.back(-1);">返回
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-1"></div>
    </div>
</div>

<!-- 实例化编辑器 -->
<script type="text/javascript">
    //自定义编辑器
    var ue = UE.getEditor('container',
        {
            toolbars: [
                ['fullscreen', 'source', 'undo', 'redo', '|',
                    'bold', 'italic', 'underline', 'forecolor',
                    'fontsize', 'fontborder', 'strikethrough',
                    '|', 'removeformat', 'formatmatch',
                    'autotypeset', 'blockquote', '|',
                    'backcolor', 'insertorderedlist',
                    'insertunorderedlist', 'selectall', '|',
                    'rowspacingtop', 'rowspacingbottom',
                    'lineheight', 'indent', 'justifyleft',
                    'justifycenter', 'justifyright',
                    'justifyjustify', '|', 'link',
                    'simpleupload', 'insertimage', 'emotion',
                    'scrawl'],
                ['insertvideo', 'music', 'attachment', 'map',
                    'pagebreak', 'template', 'background', '|',
                    'inserttable', 'deletetable',
                    'insertparagraphbeforetable', 'insertrow',
                    'deleterow', 'insertcol', 'deletecol',
                    'mergecells', 'mergeright', 'mergedown',
                    'splittocells', 'splittorows',
                    'splittocols', 'charts', '|', 'print',
                    'preview', 'searchreplace', 'drafts']],
            autoHeightEnabled: true,
            autoFloatEnabled: true,
            wordCount: false, //不限定字数
            initialFrameWidth: '100%', //初始化编辑器宽度,
            initialFrameHeight: 600,//初始化编辑器高度,
            elementPathEnabled: false, //不显示源码路径
            autoHeightEnabled: false
            //不自动长高
        });
</script>

<script type="text/javascript">
    function formsubmit() {
        var na = document.getElementById("title").value;
        var ci = document.getElementById("caid").value;
        if (na == "") {
            jAlert("文章标题不能为空!", '提示');
            return false;
        }
        if (ci == "") {
            jAlert("文章栏目不能为空!", '提示');
            return false;
        }
        var editor = UE.getEditor('container');
        try {
            document.getElementById("contentId").value = editor
                .getContent(); //获取编辑器里面的内容
            document.getElementById("contentText").value = editor
                .getContentTxt(); //获取纯文本
        } catch (e) {
            return false;
        }

        return true;
    }
</script>
</body>
</html>
